<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.HashMap" %>
<%@ page import="com.augmentum.oes.Constants" %>
<%@ page import="com.augmentum.oes.util.PathUtil" %>
<%@ page import="com.augmentum.oes.util.PropertyUtil" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title>Login</title>
      <link rel="stylesheet" href="<%=PropertyUtil.getStaticPath() %>/static/css/main.css" type="text/css" />
      <link rel="stylesheet" href="<%=PropertyUtil.getStaticPath() %>/static/css/question.css" type="text/css" />
      <link rel="stylesheet" href="<%=PropertyUtil.getStaticPath() %>/static/css/divtable.css" type="text/css" />
      <script src="<%=PropertyUtil.getStaticPath() %>/static/js/jquery-1.10.2.min.js"></script>
      <script src="<%=PropertyUtil.getStaticPath() %>/static/js/dialog.js"></script>
      <script src="<%=PropertyUtil.getStaticPath() %>/static/js/question.js"></script>
  </head>
  <body>
    <div class="header">
      <div class="logo-icon">
      </div>
      <div class="head-title">
        Online Exam System
      </div>
      <div class="user-logout">
        <div class="language">
            中文
        </div>
        <div class="person-info-outdiv">
          <div onclick="javascript:window.location.href='<%=PathUtil.getFullPath("userdetail.action")%>'" class="person-info-inner float-left"><div class="person-info-inner"><img src="<%=PropertyUtil.getStaticPath() %>/static/images/ICN_Web_PersonalInformation_20x20.png" class="person-info-currentpage"></div>
          <span >${USER.userName}</span></div>
          <div class="logout1" onclick="javascript:window.location.href='../static/logout.jsp'">Logout</div>
        </div>
      </div>
    </div>
    <div class="tab-panel"> 
    <div class="question-manage active" onclick="toQuestionList();">
      Question Management
    </div>
    <div class="exam-manage" onClick="toExamList();" >
      Exam Management
    </div>
    </div>
    <div class="breadcrumb"><a onclick="toQuestionList();" class="cursor">Question Management</a> > <label >Create Question</label></div>
    <div class="content-panel content-panel-breadcrumb" style="height:580px;">
    <div class="content-empty-panel" >

          <c:if test="${!empty TIP_MESSAGE }">
          <script>
            confirmDialogShow('${TIP_MESSAGE}');
          </script>
          </c:if>
          <c:if test="${!empty errorMessage }">
             <script>
               $(function(){confirmDialogShow('${errorMessage["errorMessage"]}')});
             </script>
           </c:if>
           <c:if test="${!empty success }">
             <script>
               $(function(){confirmDialogShow('${success}')});
             </script>
           </c:if>
           <%
             session.removeAttribute("errorMessage");
             session.removeAttribute("TIP_MESSAGE");
             session.removeAttribute("success"); 
           %>
           <form action="<%=PathUtil.getFullPath("createquestion.action") %>" method="POST" id="createQuestionForm" >
            <div class="form-body">
              <div class="questionid">
                <div class="questionid-title">Question ID:</div>
               <div class="questionid-input">
                 <input type="text" disabled id="questionId" value="QT00${lastquestion.id+1 }" name="questionid"/>
               </div>
             </div> 
             <div class="question" style="margin-top:30px;">
               <div class="question-title">Question:</div>
               <div class="question-input">
                 <textarea class="text-area" onblur="recheckForm();" onmousedown="textarea(event,this)" id="question"  name="question" placeholder="Please input a question">${question.question }</textarea>
               </div>
               <div class="error-div" id="questionError"></div>
             </div>
             <div class="answer">
               <div class="answer-title">Answer:</div>
                 <div class="answer-input" style="margin-top:20px;">
                   <div>
                     <input name="answer_radio" type="radio" onchange="checkRadio();" value="A" <c:if test="${radio eq 'A'}" >checked="checked" </c:if> >A<input  name="answer" id="ansa" type="text" value="${question.answerA }" onblur="recheckForm();" placeholder="Please input an answer">
                   </div>
                   <div>
                     <input name="answer_radio" type="radio" onchange="checkRadio();" value="B" <c:if test="${radio eq 'B'}" >checked="checked" </c:if> >B<input name="answer" id="ansb" type="text" value="${question.answerB }" onblur="recheckForm();" placeholder="Please input an answer">
                   </div>
                   <div>
                     <input name="answer_radio" type="radio" onchange="checkRadio();" value="C" <c:if test="${radio eq 'C'}" >checked="checked" </c:if> >C<input name="answer" id="ansc" type="text" value="${question.answerC }" onblur="recheckForm();" placeholder="Please input an answer">
                   </div>
                   <div>
                     <input name="answer_radio" type="radio" onchange="checkRadio();" value="D" <c:if test="${radio eq 'D'}" >checked="checked" </c:if> >D<input name="answer" id="ansd" type="text" value="${question.answerD}" onblur="recheckForm();" placeholder="Please input an answer">
                   </div>
                  </div>
                  <div class="error-div line-height" id="answerError"></div>
                </div>
               
                  <div class="edit-outdiv" style="margin-top:50px;">
                    <div class="edit-button" onclick="submitCreateForm();"  onmouseout="this.className='edit-button'" onmouseover="this.className='edit-button-over'" style="float:left;">
                      Create
                    </div>
                    <div class="edit-button" onClick="toQuestionList();" onmouseout="this.className='edit-button'" onmouseover="this.className='edit-button-over'" style="float:right;" >
                      Cancel
                    </div>
                  </div>
              </div>
              </form>
         </div>
      </div>
    <div class="footer">
      <p> Copyright © 2014 Augmentum, Inc.All Rights Reserved.</p>
    </div>
    <div class="modal-dialog" id="modalDialog">
      <div onclick="modalDialogHidden();" title="Close Dialog" class="modal-dialog-closebutton"></div>
      <div class="modal-dialog-msg" id="msgContent"></div>
      <div class="modal-dialog-btn-outdiv">
         <div class="modal-btn modal-dialog-btn-yes single-button" onclick="modalDialogHidden();">OK</div>
      </div>
    </div>
    <div class="modal-dialog" id="confirmDialog">
      <div onclick="confirmHidden();" title="Close Dialog" class="modal-dialog-closebutton">
      </div>
      <div class="modal-dialog-msg" id="confirmContent">
      </div>
      <div class="modal-dialog-btn-outdiv">
        <div class="modal-btn modal-dialog-btn-yes" onclick="confirmHidden();">Create Another</div>
        <div class="modal-btn modal-dialog-btn-no" onclick="toDetail('${QUESTION.id}');">View Question</div>
      </div>
    </div>
    <div class="modal-div" id="modalDiv"></div>
  </body>
</html>